<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:rich="http://richfaces.org/rich"
	xmlns:a4j="http://richfaces.org/a4j">

<ui:composition template="../templates/hub.xhtml">
	<ui:define name="titre">#{lbl['login.title']}</ui:define>
	<ui:define name="hub_page">

		<script language="javascript">
			function javascriptOnLoad(){
					makeFocusOnField("login_form:login");
				}
		</script>

		<div id="login_div" align="center">

			<!-- Logo Ecr. -->
			<h:graphicImage value="../../imgs/colas_logo.jpg" width="75" />
			<h:graphicImage value="../../imgs/colas_logo_lines.jpg" />

			<!-- Formulaire de connexion. -->
			<h:form id="login_form">
				<a4j:outputPanel id="login_panel">
					<rich:panel styleClass="rich_panel" headerClass="rich_panel_head"
						style="width:480px;">
						<f:facet name="header">
							<h:outputText value="#{lbl['login.pannel.head']}" />
						</f:facet>

						<h:panelGrid columnClasses="_left" styleClass="panel"
							style="width:460px; height:255px" border="0">

							<rich:messages ajaxRendered="true" layout="list" />

							<h:outputText value="#{lbl['login.pannel.text']}" />
							<h:panelGrid columns="2" columnClasses="_left_top, _left_top">

								<h:graphicImage value="../../imgs/icons/ico_lock.png" />

								<h:panelGrid columns="2" styleClass="panel"
									columnClasses="_left, _right" border="0">

									<h:panelGroup>
										<h:outputText value="#{lbl['login.user']}" /> :
								</h:panelGroup>

									<h:inputText id="login" value="#{loginManaged.login}" size="25"
										maxlength="15" required="true" tabindex="1"
										requiredMessage="#{err['login.required']}" />

									<h:panelGroup>
										<h:outputText value="#{lbl['login.password']}" /> : 
								</h:panelGroup>

									<h:inputSecret id="password" value="#{loginManaged.password}"
										size="25" maxlength="15" required="true" redisplay="true"
										requiredMessage="#{err['password.required']}" tabindex="2" />

									<h:selectBooleanCheckbox tabindex="3" />
									<h:outputText value="#{lbl['login.coordinates']}" />

									<h:commandButton id="login_b_erase" type="reset"
										rendered="#{loginManaged.displayConnectButton}"
										onclick="makeFocusOnField('login_form:login');"
										value="#{lbl['common.button.erase']}" />

									<a4j:commandButton id="login_b_validate"
										action="#{loginManaged.login}" render="login_panel"
										rendered="#{loginManaged.displayConnectButton}"
										value="#{lbl['common.button.validate']}" />

									<a4j:commandButton id="login_b_force_validate"
										action="#{loginManaged.loginForce}"
										rendered="#{!loginManaged.displayConnectButton}"
										value="#{lbl['common.button.force']}" />

									<a4j:commandButton id="login_b_consult"
										action="#{loginManaged.loginConsult}"
										rendered="#{!loginManaged.displayConnectButton}"
										value="#{lbl['common.button.consult']}" />
								</h:panelGrid>
							</h:panelGrid>
						</h:panelGrid>
					</rich:panel>
				</a4j:outputPanel>
			</h:form>
            <center>
			<h:panelGrid style="width:430px;margin-top:15px">
				<h:panelGroup>
					<h:outputText value="#{lbl['login.bottom.text']}" escape="false" />
					<p/>
				[ <h:outputText value="#{lbl['login.absbottom.text']}"
						escape="false" /> ]
				</h:panelGroup>
			</h:panelGrid>
			</center>
		</div>
	</ui:define>
</ui:composition>
</html>